import React from 'react';
import { motion } from 'framer-motion';

interface PulseAnimationProps {
  children: React.ReactNode;
  className?: string;
  pulseColor?: string;
  pulseSize?: number;
}

const PulseAnimation: React.FC<PulseAnimationProps> = ({ 
  children, 
  className = '',
  pulseColor = 'rgba(97, 220, 163, 0.4)',
  pulseSize = 1.1
}) => {
  return (
    <div className={className} style={{ position: 'relative' }}>
      <motion.div
        animate={{ 
          scale: [1, pulseSize, 1],
          opacity: [0.7, 0.4, 0.7]
        }}
        transition={{ 
          duration: 2,
          repeat: Infinity,
          ease: "easeInOut"
        }}
        style={{
          position: 'absolute',
          top: '50%',
          left: '50%',
          width: '100%',
          height: '100%',
          borderRadius: 'inherit',
          background: pulseColor,
          transform: 'translate(-50%, -50%)',
          zIndex: -1
        }}
      />
      {children}
    </div>
  );
};

export default PulseAnimation;